<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<div class="header-top clearfix" id="top">
    <div class="container">
        <div class="rows">
            <!-- SIDEBAR TOP MENU  顶部菜单-->
            <div class="pull-left top1">
                <div class="widget pull-left">
                    <div class="widget-inner">
                        <div class="call-us"><span th:text="#{callusnow}">Call Us Now: </span>0123-444-666654123</div>
                    </div>
                </div>

            </div>

            <div class="pull-right">
                <div class="sidebar-account pull-left">
                    <div class="account-title">
                        <span th:if="${session.userInfo != null }">	<span
                                th:text="${session.userInfo.username}"></span>
                        </span>

                        <span th:if="${session.userInfo == null}">
									[[#{myaccount}]]
                        </span>

                    </div>

                    <div id="my-account" class="my-account">
                        <div class="widget widget_nav_menu">
                            <div class="widget-inner">
                                <ul id="menu-my-account" class="menu">
                                    <li class="menu-my-account">
                                        <a class="item-link" th:href="@{/myaccount}">
                                            <span class="menu-title">[[#{myaccount}]]</span>
                                        </a>
                                    </li>

                                    <li class="menu-cart">
                                        <a class="item-link" th:href="@{/cart}">
                                            <span class="menu-title">[[#{cart}]]</span>
                                        </a>
                                    </li>

                                    <li class="menu-checkout">
                                        <a class="item-link" th:href="@{/checkout}">
                                            <span class="menu-title">[[#{paythebill}]]</span>
                                        </a>
                                    </li>

                                    <li class="menu-wishlist">
                                        <a class="item-link" th:href="@{/wishlist}">
                                            <span class="menu-title">[[#{wishlist}]]</span>
                                        </a>
                                    </li>
                                    <li>
                                        <span th:if="${session.userInfo != null }">
                                            <span><a th:href="@{/logout}">[[#{logout}]]</a></span>
                                        </span>

                                        <span th:if="${session.userInfo == null}">
										<a href="javascript:void(0);" data-toggle="modal" data-target="#login_form">
                                            <span>[[#{login.btn}]]</span>
                                        </a>
                                        </span>

                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="pull-left top2">
                    <div class="widget widget_nav_menu">
                        <div class="widget-inner">
                            <ul id="menu-checkout" class="menu">
                                <li class="menu-checkout">
                                    <a class="item-link" th:href="@{/checkout}">
                                        <span class="menu-title">[[#{paythebill}]]</span>
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="header-mid clearfix" id="mid">
    <div class="container">
        <div class="rows">
            <!-- LOGO -->
            <div class="etrostore-logo pull-left">
                <a th:href="@{/index}">
                    <img th:src="@{/images/icons/logo-orange.png}" alt="Shoopy">
                </a>
            </div>

            <div class="mid-header pull-right">
                <div class="widget sw_top-2 sw_top">
                    <div class="widget-inner">
                        <div class="top-form top-search">
                            <form th:action="@{/product/search}" method="post">
                                <div class="topsearch-entry">
                                    <input type="text" value="" name="s" th:placeholder="#{enteryourkeyword}">

                                    <div class="cat-wrapper">
                                        <label class="label-search">
                                            <select name="search_category" class="s1_option">
                                                <option value="" th:text="#{allcategories}">All Categories</option>
                                                <option value="1">电子产品</option>
                                                <option value="21">电脑</option>
                                                <option value="41">家用电器</option>

                                                <!--<option value="15" name="category" th:text="#{homef}">Home Furniture</option>-->
                                                <!--<option value="16" name="category" th:text="#{homea}">Home Appliances</option>-->
                                                <!--<option value="17" name="category" th:text="#{electronic}">Electronic Component</option>-->
                                                <!--<option value="18" name="category" th:text="#{household}">Household Goods</option>-->
                                                <!--<option value="32" name="category" th:text="#{appliances}">Appliances</option>-->
                                                <!--<option value="49" name="category" th:text="#{Accessories}">Accessories</option>-->
                                                <!--<option value="51" name="category" th:text="#{electronics}">Electronics</option>-->
                                                <!--<option value="78" name="category" th:text="#{tv}">Televisions</option>-->
                                                <!--<option value="80" name="category" th:text="#{camera}">Cameras & Accessories</option>-->
                                            </select>
                                        </label>
                                    </div>
                                    <!--查找按钮-->
                                    <button type="submit" title="Search"
                                            class="fa fa-search button-search-pro"></button>
                                </div>
                            </form>


                        </div>
                    </div>
                </div>

                <div class="widget sw_top-3 sw_top pull-left">
                    <div class="widget-inner">
                        <div class="top-form top-form-minicart etrostore-minicart pull-right">
                            <div class="top-minicart-icon pull-right">
                                <i class="fa fa-shopping-cart"></i>

                            </div>

                            <div class="wrapp-minicart">
                                <div class="minicart-padding">
                                    <div class="number-item">
                                        <span>[[#{thereareitem}]]</span>
                                    </div>

                                    <ul class="minicart-content">
                                        <li th:if="${session.items!=null}" th:each="item:${session.items}">
                                            <a href="" class="product-image">
                                                <img width="100" height="100" th:src="${item.getProduct().getPimage()}"
                                                     class="attachment-100x100 size-100x100 wp-post-image" alt=""
                                                />
                                            </a>

                                            <div class="detail-item">
                                                <div class="product-details">
                                                    <h4>
                                                        <a class="title-item"
                                                           th:href="@{/simpleproduct/}+${item.getProduct().getPid()}"><span
                                                                th:text="${item.getProduct().getPname()}"></span></a>
                                                    </h4>

                                                    <div class="product-price">
																	<span class="price">
																		<span th:text="${item.getProduct().getShopPrice()}"></span>
																	</span>

                                                        <div class="qty">
                                                            <span class="qty-number"
                                                                  th:text="${item.getCount()}"></span>
                                                        </div>
                                                    </div>
                                                    <div class="product-action">
                                                        <a class="btn-edit" th:href="@{/cart}"
                                                           title="View your shopping cart">
                                                            <span class="fa fa-pencil"></span>
                                                        </a>
                                                    </div>
                                                </div>
                                            </div>
                                        </li>


                                    </ul>

                                    <div class="cart-checkout">
                                        <div th:if="${session.cart!=null}" class="price-total">
                                            <span class="label-price-total" th:text="#{total}">Total</span>

                                            <span class="price-total-w">
															<span class="price">
																<span th:text="${session.cart.getTotal()}"></span>
															</span>
														</span>
                                        </div>

                                        <div class="cart-links">
                                            <div class="cart-link">
                                                <a th:href="@{/cart}" title="Cart">[[#{viewcart}]]</a>
                                            </div>

                                            <div class="checkout-link">
                                                <a th:href="@{/checkout}" title="Check Out">[[#{paythebill}]]</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="widget widget_nav_menu pull-left">
                    <div class="widget-inner">
                        <ul id="menu-wishlist" class="menu">
                            <li class="menu-wishlist">
                                <a class="item-link" th:href="@{/wishlist}">
                                    <span class="menu-title">Wishlist</span>
                                </a>
                            </li>

                            <li class="yith-woocompare-open menu-compare">
                                <a class="item-link compare" href="#">
                                    <span class="menu-title">Compare</span>
                                </a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="header-bottom clearfix" id="bottom">
    <div class="container">
        <div class="rows">
            <!-- Primary navbar -->
            <div id="main-menu" class="main-menu">
                <nav id="primary-menu" class="primary-menu">
                    <div class="navbar-inner navbar-inverse">
                        <div class="resmenu-container">
                            <button class="navbar-toggle" type="button" data-toggle="collapse"
                                    data-target="#ResMenuprimary_menu">
                                <span class="sr-only" th:text="#{allcategories}">Categories</span>
                                <span class="icon-bar"></span>
                                <span class="icon-bar"></span>
                                <span class="icon-bar"></span>
                            </button>

                            <div id="ResMenuprimary_menu" class="collapse menu-responsive-wrapper">
                                <ul id="menu-primary-menu" class="etrostore_resmenu">
                                    <li class="active res-dropdown menu-home">
                                        <a class="item-link dropdown-toggle" th:href="@{/index}">[[#{home}]]</a>
                                        <span class="show-dropdown"></span>

                                    </li>

                                    <li class="res-dropdown menu-shop">
                                        <a class="item-link dropdown-toggle" href="#" th:text="#{SHOP}"></a>
                                        <span class="show-dropdown"></span>

                                        <ul class="dropdown-resmenu">
                                            <li class="res-dropdown menu-shop-pages">
                                                <a class="item-link dropdown-toggle" th:text="#{shoppages}">Shop
                                                    Pages</a>
                                                <span class="show-dropdown"></span>

                                                <ul class="dropdown-resmenu">
                                                    <li class="menu-shop">
                                                        <a th:href="@{/shop}" th:text="#{SHOP}"></a>
                                                    </li>

                                                    <li class="menu-cart">
                                                        <a th:href="@{/cart}" th:text="#{cart}"></a>
                                                    </li>

                                                    <li class="menu-checkout">
                                                        <a th:href="@{/checkout}" th:text="#{paythebill}"></a>
                                                    </li>

                                                    <li class="menu-my-account">
                                                        <a th:href="@{/myaccount}" th:text="#{myaccount}"></a>
                                                    </li>

                                                    <li class="menu-wishlist">
                                                        <a th:href="@{/wishlist}" th:text="#{wishlist}"></a>
                                                    </li>
                                                </ul>
                                            </li>


                                        </ul>
                                    </li>

                                    <li class="res-dropdown menu-smartphones-tablet">
                                        <a class="item-link dropdown-toggle" href="#" th:text="#{smartphone}">Smartphones
                                            & Tablet</a>
                                        <span class="show-dropdown"></span>

                                        <ul class="dropdown-resmenu">
                                            <li class="res-dropdown menu-electronics">
                                                <a class="item-link dropdown-toggle" href="#" th:text="#{electronics}">Electronics</a>
                                                <span class="show-dropdown"></span>

                                                <ul class="dropdown-resmenu">
                                                    <li class="menu-leds">
                                                        <a href="#" th:text="#{leds}">Leds</a>
                                                    </li>

                                                    <li class="menu-laptop-desktop-accessories">
                                                        <a href="#" th:text="#{Accessories}">Laptop & Desktop
                                                            Accessories</a>
                                                    </li>

                                                    <li class="menu-storage-external-drives">
                                                        <a href="#" th:text="#{storageexternaldrives}">Storage &
                                                            External Drives</a>
                                                    </li>

                                                    <li class="menu-networking-wireless">
                                                        <a href="#" th:text="#{networking}">Networking & Wireless</a>
                                                    </li>

                                                    <li class="menu-motherboards-cpus-psus">
                                                        <a href="#" th:text="#{motherboards}">Motherboards, CPUs &
                                                            PSUs</a>
                                                    </li>

                                                    <li class="menu-webcams">
                                                        <a href="#" th:text="#{webcams}">Webcams</a>
                                                    </li>

                                                    <li class="menu-gaming">
                                                        <a href="#" th:text="#{gaming}">Gaming</a>
                                                    </li>
                                                </ul>
                                            </li>

                                            <li class="res-dropdown menu-smartphone">
                                                <a class="item-link dropdown-toggle" href="#" th:text="#{phone}">Smartphone</a>
                                                <span class="show-dropdown"></span>

                                                <ul class="dropdown-resmenu">
                                                    <li class="menu-smartphones">
                                                        <a href="#" th:text="#{phone}">Smartphones</a>
                                                    </li>

                                                    <li class="menu-mobile-phones">
                                                        <a href="#" th:text="#{mobilephones}">Mobile Phones</a>
                                                    </li>

                                                    <li class="menu-smart-watches-accessories">
                                                        <a href="#" th:text="#{smartwatch}">Smart Watches &
                                                            Accessories</a>
                                                    </li>

                                                    <li class="menu-mobile-accessories">
                                                        <a href="#" th:text="#{mobileaccessories}">Mobile
                                                            Accessories</a>
                                                    </li>

                                                    <li class="menu-cases-covers">
                                                        <a href="#" th:text="#{casescovers}">Cases & Covers</a>
                                                    </li>

                                                    <li class="menu-power-banks">
                                                        <a href="#" th:text="#{poweranks}">Power Banks</a>
                                                    </li>

                                                    <li class="menu-memory-cards">
                                                        <a href="#" th:text="#{moneycards}">Memory Cards</a>
                                                    </li>

                                                    <li class="menu-headphonesheadsets">
                                                        <a href="#" th:text="#{headphone}">Headphones/Headsets</a>
                                                    </li>
                                                </ul>
                                            </li>

                                            <li class="res-dropdown menu-tablet">
                                                <a class="item-link dropdown-toggle" href="#" th:text="#{extablet}">Tablet</a>
                                                <span class="show-dropdown"></span>

                                                <ul class="dropdown-resmenu">
                                                    <li class="menu-tablets">
                                                        <a href="#" th:text="#{extablet}">Tablets</a>
                                                    </li>

                                                    <li class="menu-tablet-accessories">
                                                        <a href="#" th:text="#{tabletaccessorise}">Tablet
                                                            Accessories</a>
                                                    </li>

                                                    <li class="menu-cases-covers">
                                                        <a href="#">Cases & Covers</a>
                                                    </li>

                                                    <li class="menu-power-banks">
                                                        <a href="#">Power Banks</a>
                                                    </li>

                                                    <li class="menu-memory-cards">
                                                        <a href="#">Memory Cards</a>
                                                    </li>

                                                    <li class="menu-headphonesheadsets">
                                                        <a href="#">Headphones/Headsets</a>
                                                    </li>
                                                </ul>
                                            </li>

                                            <li class="res-dropdown menu-computer">
                                                <a class="item-link dropdown-toggle" href="#">Computer</a>
                                                <span class="show-dropdown"></span>

                                                <ul class="dropdown-resmenu">
                                                    <li class="menu-computers">
                                                        <a href="#">Computers</a>
                                                    </li>

                                                    <li class="menu-macbooks-imacs">
                                                        <a href="#">Macbooks & iMacs</a>
                                                    </li>

                                                    <li class="menu-computers-desktops">
                                                        <a href="#">Computers & Desktops</a>
                                                    </li>

                                                    <li class="menu-printers-scanners-faxs">
                                                        <a href="#">Printers, Scanners, & Faxs</a>
                                                    </li>

                                                    <li class="menu-laptop-desktop-accessories">
                                                        <a href="#">Laptop & Desktop Accessories</a>
                                                    </li>

                                                    <li class="menu-storage-external-drives">
                                                        <a href="#">Storage & External Drives</a>
                                                    </li>

                                                    <li class="menu-networking-wireless">
                                                        <a href="#">Networking & Wireless</a>
                                                    </li>

                                                    <li class="menu-motherboards-cpus-psus">
                                                        <a href="#">Motherboards, CPUs & PSUs</a>
                                                    </li>
                                                </ul>
                                            </li>
                                        </ul>
                                    </li>

                                    <li class="res-dropdown menu-blog">
                                        <a class="item-link dropdown-toggle" href="#">Blog</a>
                                        <span class="show-dropdown"></span>

                                        <ul class="dropdown-resmenu">
                                            <li class="res-dropdown menu-blog-layouts">
                                                <a class="item-link dropdown-toggle" href="#">Blog Layouts</a>
                                                <span class="show-dropdown"></span>

                                                <ul class="dropdown-resmenu">
                                                    <li class="menu-left-sidebar-default">
                                                        <a href="blog_left_sidebar.html">Left Sidebar Default</a>
                                                    </li>

                                                    <li class="menu-left-sidebar-list">
                                                        <a href="blog_left_sidebar_list.html">Left Sidebar List</a>
                                                    </li>

                                                    <li class="menu-right-sidebar-list">
                                                        <a href="blog_right_sidebar_list.html">Right Sidebar List</a>
                                                    </li>

                                                    <li class="menu-full-width-list">
                                                        <a href="blog_full_width_list.html">Full width List</a>
                                                    </li>
                                                </ul>
                                            </li>

                                            <li class="res-dropdown menu-blog-layouts-2">
                                                <a class="item-link dropdown-toggle" href="#">Blog Layouts 2</a>
                                                <span class="show-dropdown"></span>

                                                <ul class="dropdown-resmenu">
                                                    <li class="menu-2-columns-grid">
                                                        <a href="blog_two_columns.html">2 Columns Grid</a>
                                                    </li>

                                                    <li class="menu-3-columns-grid">
                                                        <a href="blog_three_columns.html">3 Columns Grid</a>
                                                    </li>

                                                    <li class="menu-4-columns-grid">
                                                        <a href="blog_four_columns.html">4 Columns Grid</a>
                                                    </li>
                                                </ul>
                                            </li>

                                            <li class="res-dropdown menu-post-formats">
                                                <a class="item-link dropdown-toggle" href="#">Post Formats</a>
                                                <span class="show-dropdown"></span>

                                                <ul class="dropdown-resmenu">
                                                    <li class="menu-post-format-image">
                                                        <a href="post_format_image.html">Post Format : Image</a>
                                                    </li>

                                                    <li class="menu-post-format-audio">
                                                        <a href="post_format_audio.html">Post Format : Audio</a>
                                                    </li>

                                                    <li class="menu-post-format-gallery">
                                                        <a href="post_format_gallery.html">Post Format : Gallery</a>
                                                    </li>

                                                    <li class="menu-post-format-video">
                                                        <a href="post_format_video.html">Post Format : Video</a>
                                                    </li>
                                                </ul>
                                            </li>

                                            <li class="res-dropdown menu-post-layouts">
                                                <a class="item-link dropdown-toggle" href="#">Post Layouts</a>
                                                <span class="show-dropdown"></span>

                                                <ul class="dropdown-resmenu">
                                                    <li class="menu-full-width">
                                                        <a href="post_layout_full_width.html">Full Width</a>
                                                    </li>

                                                    <li class="menu-left-sidebar">
                                                        <a href="post_layout_left_sidebar.html">Left Sidebar</a>
                                                    </li>

                                                    <li class="menu-right-sidebar">
                                                        <a href="post_layout_right_sidebar.html">Right Sidebar</a>
                                                    </li>
                                                </ul>
                                            </li>
                                        </ul>
                                    </li>

                                    <li class="menu-deals">
                                        <a class="item-link" href="/deals?page=1&limit=10">Deals</a>
                                    </li>


                                    <li class="menu-about-us">
                                        <a class="item-link" th:href="@{/aboutus}">[[#{aboutus}]]</a>
                                    </li>


                                </ul>
                            </div>
                        </div>

                        <ul id="menu-primary-menu-1" class="nav nav-pills nav-mega etrostore-mega etrostore-menures">
                            <li class="active dropdown menu-home etrostore-mega-menu level1">
                                <a th:href="@{/index}" class="item-link dropdown-toggle">
												<span class="have-title">
													<span class="menu-color" data-color="#f034ca"></span>
													<span class="menu-title" th:text="#{home}"></span>
												</span>
                                </a>

                            </li>

                            <li class="dropdown menu-shop etrostore-mega-menu level1 etrostore-menu-img">
                                <a th:href="@{/shop}" class="item-link dropdown-toggle">
												<span class="have-title">
													<span class="menu-color" data-color="#f03442"></span>

													<span class="menu-img">
														<img th:src="@{/images/1903/icon-new-1.png}" alt="Menu Image"/>
													</span>

													<span class="menu-title" th:text="#{SHOP}"></span>
												</span>
                                </a>

                                <ul class="dropdown-menu nav-level1 column-4">
                                    <li class="dropdown-submenu column-4 menu-shop-pages">
                                        <a href="#">
														<span class="have-title">
															<span class="menu-title"
                                                                  th:text="#{shoppages}">Shop Pages</span>
														</span>
                                        </a>

                                        <ul class="dropdown-sub nav-level2">
                                            <li class="menu-shop">
                                                <a th:href="@{/shop}">
																<span class="have-title">
																	<span class="menu-title" th:text="#{SHOP}"></span>
																</span>
                                                </a>
                                            </li>

                                            <li class="menu-cart">
                                                <a th:href="@{/cart}">
																<span class="have-title">
																	<span class="menu-title" th:text="#{cart}"></span>
																</span>
                                                </a>
                                            </li>

                                            <li class="menu-checkout">
                                                <a th:href="@{/checkout}">
																<span class="have-title">
																	<span class="menu-title"
                                                                          th:text="#{paythebill}"></span>
																</span>
                                                </a>
                                            </li>

                                            <li class="menu-my-account">
                                                <a th:href="@{/myaccount}">
																<span class="have-title">
																	<span class="menu-title"
                                                                          th:text="#{myaccount}"></span>
																</span>
                                                </a>
                                            </li>

                                            <li class="menu-wishlist">
                                                <a th:href="@{/wishlist}">
																<span class="have-title">
																	<span class="menu-title"
                                                                          th:text="#{wishlist}"></span>
																</span>
                                                </a>
                                            </li>
                                        </ul>
                                    </li>

                                </ul>
                            </li>

                            <li class=" dropdown menu-smartphones-tablet etrostore-mega-menu level1">
                                <a href="#" class="item-link dropdown-toggle">
												<span class="have-title">
													<span class="menu-color" data-color="#13528c"></span>

													<span class="menu-title" th:text="#{smartphones}"></span>
												</span>
                                </a>
                                <!--手机与平板  下拉页-->
                                <ul class="dropdown-menu nav-level1 column-4">
                                    <!--                                    电子产品-->

                                    <li class="dropdown-submenu column-4 menu-electronics etrostore-menu-img">
                                        <a href="#">
                                           <span class="have-title">
                                               <span class="menu-img">
                                                   <img th:src="@{/images/1903/menu-bn4.jpg}" alt="Menu Image"/>
                                               </span>
                                                <span class="menu-title" th:text="#{com}"></span>
                                           </span>
                                        </a>


                                        <ul class="dropdown-sub nav-level2">
                                            <li class="menu-leds">
                                                <a href="/shop/1">
																<span class="have-title">
																	<span class="menu-title" th:text="#{tv}"></span>
																</span>
                                                </a>
                                            </li>

                                            <li class="menu-laptop-desktop-accessories">
                                                <a href="/shop/2">
																<span class="have-title">
																	<span class="menu-title"
                                                                          th:text="#{aircondition}"></span>
																</span>
                                                </a>
                                            </li>

                                            <li class="menu-storage-external-drives">
                                                <a href="/shop/3">
																<span class="have-title">
																	<span class="menu-title"
                                                                          th:text="#{Accessories}"></span>
																</span>
                                                </a>
                                            </li>

                                            <li class="menu-networking-wireless">
                                                <a href="/shop/4">
																<span class="have-title">
																	<span class="menu-title" th:text="#{juicer}"></span>
																</span>
                                                </a>
                                            </li>

                                            <li class="menu-motherboards-cpus-psus">
                                                <a href="/shop/5">
																<span class="have-title">
																	<span class="menu-title"
                                                                          th:text="#{smartphone}"></span>
																</span>
                                                </a>
                                            </li>

                                            <li class="menu-webcams">
                                                <a href="/shop/6">
																<span class="have-title">
																	<span class="menu-title" th:text="#{UAV}"></span>
																</span>
                                                </a>
                                            </li>

                                            <li class="menu-gaming">
                                                <a href="/shop/7">
																<span class="have-title">
																	<span class="menu-title"
                                                                          th:text="#{projector}"></span>
																</span>
                                                </a>
                                            </li>
                                            <li class="menu-gaming">
                                                <a href="/shop/8">
																<span class="have-title">
																	<span class="menu-title"
                                                                          th:text="#{headphone}"></span>
																</span>
                                                </a>
                                            </li>
                                            <li class="menu-gaming">
                                                <a href="/shop/9">
																<span class="have-title">
																	<span class="menu-title" th:text="#{router}"></span>
																</span>
                                                </a>
                                            </li>
                                            <li class="menu-gaming">
                                                <a href="/shop/10">
																<span class="have-title">
																	<span class="menu-title"
                                                                          th:text="#{workstation}"></span>
																</span>
                                                </a>
                                            </li>
                                        </ul>
                                    </li>
                                    <!--电脑-->
                                    <li class="dropdown-submenu column-4 menu-smartphone etrostore-menu-img">
                                        <a href="#">
														<span class="have-title">
															<span class="menu-img">
																<img th:src="@{/images/1903/menu-bn4.jpg}"
                                                                     alt="Menu Image"/>
															</span>

															<span class="menu-title" th:text="#{com}"></span>
														</span>
                                        </a>

                                        <ul class="dropdown-sub nav-level2">
                                            <li class="menu-smartphones">
                                                <a href="/shop/21">
																<span class="have-title">
																<span class="menu-title" th:text="#{dell}"></span>
                                                                </span>
                                                </a>
                                            </li>

                                            <li class="menu-mobile-phones">
                                                <a href="/shop/22">
																<span class="have-title">
																<span class="menu-title" th:text="#{macbook}"></span>
                                                                </span>
                                                </a>
                                            </li>

                                            <li class="menu-smart-watches-accessories">
                                                <a href="/shop/23">
																<span class="have-title">
																<span class="menu-title" th:text="#{msilaptop}"></span>
                                                                </span>
                                                </a>
                                            </li>

                                            <li class="menu-mobile-accessories">
                                                <a href="/shop/24">
																<span class="have-title">
																<span class="menu-title" th:text="#{asuslaptop}"></span>
                                                                </span>
                                                </a>
                                            </li>

                                            <li class="menu-cases-covers">
                                                <a href="/shop/25">
																<span class="have-title">
																<span class="menu-title" th:text="#{lenvo}"></span>
                                                                </span>
                                                </a>
                                            </li>

                                            <li class="menu-power-banks">
                                                <a href="/shop/26">
																<span class="have-title">
																<span class="menu-title" th:text="#{hplaptop}"></span>
                                                                </span>
                                                </a>
                                            </li>

                                            <li class="menu-memory-cards">
                                                <a href="/shop/27">
																<span class="have-title">
																<span class="menu-title" th:text="#{haier}"></span>
                                                                </span>
                                                </a>
                                            </li>

                                            <li class="menu-headphonesheadsets">
                                                <a href="/shop/28">
																<span class="have-title">
																<span class="menu-title" th:text="#{huawei}"></span>
                                                                </span>
                                                </a>
                                            </li>
                                            <li class="menu-headphonesheadsets">
                                                <a href="/shop/29">
																<span class="have-title">
																<span class="menu-title" th:text="#{THTF}"></span>
                                                                </span>
                                                </a>
                                            </li>
                                            <li class="menu-headphonesheadsets">
                                                <a href="/shop/30">
																<span class="have-title">
																<span class="menu-title" th:text="#{msilaptop}"></span>
                                                                </span>
                                                </a>
                                            </li>

                                        </ul>
                                    </li>
                                    <!--家用电器-->
                                    <li class="dropdown-submenu column-4 menu-tablet etrostore-menu-img">
                                        <a href="#">
														<span class="have-title">
															<span class="menu-img">
																<img th:src="@{/images/1903/menu-bn5.jpg}"
                                                                     alt="Menu Image"/>
															</span>

															<span class="menu-title" th:text="#{appliances}"></span>
														</span>
                                        </a>

                                        <ul class="dropdown-sub nav-level2">

                                            <li class="menu-tablet-accessories">
                                                <a href="/shop/41">
																<span class="have-title">
																	<span class="menu-title"
                                                                          th:text="#{electricfan}"></span>
																</span>
                                                </a>
                                            </li>


                                            <li class="menu-tablet-accessories">
                                                <a href="/shop/42">
																<span class="have-title">
																	<span class="menu-title"
                                                                          th:text="#{vacuumcleaner}"></span>
																</span>
                                                </a>
                                            </li>
                                            <li class="menu-tablet-accessories">
                                                <a href="/shop/43">
																<span class="have-title">
																	<span class="menu-title"
                                                                          th:text="#{electricblanket}"></span>
																</span>
                                                </a>
                                            </li>

                                            <li class="menu-tablet-accessories">
                                                <a href="/shop/44">
																<span class="have-title">
																	<span class="menu-title"
                                                                          th:text="#{electrichairdrier}"></span>
																</span>
                                                </a>
                                            </li>

                                            <li class="menu-tablet-accessories">
                                                <a href="/shop/45">
																<span class="have-title">
																	<span class="menu-title"
                                                                          th:text="#{aircleaner}"></span>
																</span>
                                                </a>
                                            </li>

                                            <li class="menu-tablet-accessories">
                                                <a href="/shop/46">
																<span class="have-title">
																	<span class="menu-title"
                                                                          th:text="#{pyralarm}"></span>
																</span>
                                                </a>
                                            </li>

                                            <li class="menu-tablet-accessories">
                                                <a href="/shop/47">
																<span class="have-title">
																	<span class="menu-title"
                                                                          th:text="#{electricmassager}"></span>
																</span>
                                                </a>
                                            </li>

                                            <li class="menu-tablet-accessories">
                                                <a href="/shop/48">
																<span class="have-title">
																	<span class="menu-title"
                                                                          th:text="#{microwave}"></span>
																</span>
                                                </a>
                                            </li>
                                            <li class="menu-tablet-accessories">
                                                <a href="/shop/49">
																<span class="have-title">
																	<span class="menu-title"
                                                                          th:text="#{electriccooker}"></span>
																</span>
                                                </a>
                                            </li>

                                            <li class="menu-tablet-accessories">
                                                <a href="/shop/50">
																<span class="have-title">
																	<span class="menu-title"
                                                                          th:text="#{electricrazor}"></span>
																</span>
                                                </a>
                                            </li>


                                        </ul>
                                    </li>


                                </ul>
                            </li>
                            <li class=" menu-deals etrostore-menu-custom level1 etrostore-menu-img">
                                <a href="/deals?page=1&limit=10" class="item-link">
												<span class="have-title">
													<span class="menu-img">
														<img th:src="@{/images/1903/icon-hot.png}" alt="Menu Image"/>
													</span>

													<span class="menu-title" th:text="#{deals}"></span>
												</span>
                                </a>
                            </li>


                            <li class=" menu-about-us etrostore-menu-custom level1">
                                <a th:href="@{/aboutus}" class="item-link">
												<span class="have-title">
													<span class="menu-title" th:text="#{aboutus}"></span>
												</span>
                                </a>

                            </li>


                        </ul>
                    </div>
                </nav>
            </div>
            <!-- /Primary navbar -->

            <div class="top-form top-form-minicart etrostore-minicart pull-right">
                <div class="top-minicart-icon pull-right">
                    <i class="fa fa-shopping-cart"></i>

                </div>

                <div class="wrapp-minicart">
                    <div class="minicart-padding">
                        <div class="number-item">
                            <span>[[#{thereareitem}]]</span>
                        </div>

                        <ul class="minicart-content">
                            <li th:if="${session.items!=null}" th:each="item:${session.items}">
                                <a href="" class="product-image">
                                    <img width="100" height="100" th:src="${item.getProduct().getPimage()}"
                                         class="attachment-100x100 size-100x100 wp-post-image" alt=""
                                    />
                                </a>

                                <div class="detail-item">
                                    <div class="product-details">
                                        <h4>
                                            <a class="title-item"
                                               th:href="@{/simpleproduct/}+${item.getProduct().getPid()}"><span
                                                    th:text="${item.getProduct().getPname()}"></span></a>
                                        </h4>

                                        <div class="product-price">
																	<span class="price">
																		<span th:text="${item.getProduct().getShopPrice()}"></span>
																	</span>

                                            <div class="qty">
                                                <span class="qty-number" th:text="${item.getCount()}"></span>
                                            </div>
                                        </div>
                                        <div class="product-action">
                                            <a class="btn-edit" th:href="@{/cart}" title="View your shopping cart">
                                                <span class="fa fa-pencil"></span>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            </li>


                        </ul>

                        <div class="cart-checkout">
                            <div th:if="${session.cart!=null}" class="price-total">
                                <span class="label-price-total" th:text="#{total}">Total</span>

                                <span class="price-total-w">
															<span class="price">
																<span th:text="${session.cart.getTotal()}"></span>
															</span>
														</span>
                            </div>

                            <div class="cart-links">
                                <div class="cart-link">
                                    <a th:href="@{/cart}" title="Cart">[[#{viewcart}]]</a>
                                </div>

                                <div class="checkout-link">
                                    <a th:href="@{/checkout}" title="Check Out">[[#{paythebill}]]</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="mid-header pull-right">
                <div class="widget sw_top">
								<span class="stick-sr">
									<i class="fa fa-search" aria-hidden="true"></i>
								</span>

                    <div class="top-form top-search">
                        <form th:action="@{/product/search}" class="topsearch-entry" method="post">
                            <input type="text" value="" name="s" class="search-query" placeholder="Keyword here..."/>
                            <button type="submit" class="button-search-pro">Search</button>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="login_form" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog block-popup-login">
        <a href="javascript:void(0)" title="Close" class="close close-login" data-dismiss="modal">Close</a>

        <div class="tt_popup_login">
            <strong>[[#{signorregister}]]</strong>
        </div>

        <form th:action="@{/login}" method="post" class="login">
            <div class="block-content">
                <div class="col-reg registered-account">
                    <div class="email-input">
                        <input type="text" class="form-control input-text username" name="username" id="username"
                               th:placeholder="#{login.username}"/>
                    </div>

                    <div class="pass-input">
                        <input class="form-control input-text password" type="password"
                               th:placeholder="#{login.password}" name="password" id="password"/>
                    </div>

                    <div class="ft-link-p">
                        <a th:href="@{/lost_password}" th:title="#{forgotyour}">[[#{forgotyour}]]</a>
                    </div>

                    <div class="actions">
                        <div class="submit-login">
                            <input type="submit" class="button btn-submit-login" name="login" th:value="#{login.btn}"/>
                        </div>
                    </div>
                </div>

                <div class="col-reg login-customer">
                    <h2>[[#{newhere}]]</h2>

                    <p class="note-reg">[[#{registrationisfree}]]</p>

                    <ul class="list-log">
                        <li>[[#{fastercheckout}]]</li>

                        <li>[[#{savemultiple}]]</li>

                        <li>[[#{viewandtrack}]]</li>
                    </ul>

                    <a th:href="@{/createaccount}" title="Register" class="btn-reg-popup">[[#{createanaccount}]]</a>
                </div>
            </div>
        </form>
        <div class="clear"></div>
    </div>
</div>
</body>
</html>